{% extends "website/base.html" %}
{% block content %}
<section class="section">
  <div class="card">
    <div class="card-title">
      <div class="icon">🧷</div>
      <div>
        <h1 class="h1" style="margin:0">Audit Log</h1>
        <div class="muted">Strong compliance log — who edited what</div>
      </div>
      <div style="margin-left:auto">
        <a class="btn btn-sm" href="{% url 'website:emr:staff_emr_dashboard' %}">Back</a>
      </div>
    </div>

    <form method="get" style="display:flex; gap:8px; margin-bottom:10px;">
      <input class="input" type="text" name="q" value="{{ q }}" placeholder="Search actor/model/object…" style="flex:1" />
      <button class="btn" type="submit">Search</button>
    </form>

    <div style="display:flex; flex-direction:column; gap:8px;">
      {% for ev in events %}
        <div class="row" style="cursor:default">
          <div>
            <div style="font-weight:800">{{ ev.created_at|date:"M d, Y H:i" }} · {{ ev.action|upper }}</div>
            <div class="muted">
              {% if ev.actor %}{{ ev.actor.username }}{% else %}System{% endif %}
              · {{ ev.model_label }} #{{ ev.object_id }}
              {% if ev.ip_address %} · {{ ev.ip_address }}{% endif %}
            </div>
            {% if ev.changes and ev.action == "update" %}
              <div class="muted" style="margin-top:4px;">
                Updated fields:
                {% for k,v in ev.changes.items %}
                  <span class="pill">{{ k }}</span>
                {% endfor %}
              </div>
            {% endif %}
          </div>
          <div class="pill">{{ ev.object_repr }}</div>
        </div>
      {% empty %}
        <div class="muted">No audit events.</div>
      {% endfor %}
    </div>
  </div>
</section>
{% endblock %}